<template>
  <div>
    <ClTablePage
      :columnList="columnList"
      :formProps="formProps"
      title="我是标题"
    ></ClTablePage>
  </div>
</template>

<script setup lang="ts">
const formProps = {
  hideLabel: true,
  labelSuffix: ':',
}
const columnList = [
  {
    label: '日期',
    prop: 'input',
    formItem: {
      componentName: 'ElInput',
      prop: 'input1',
      placeholder: '请输入',
    },
  },
  {
    label: '日期',
    prop: 'select',
    formItem: {
      componentName: 'ElSelect',
      placeholder: '请输入',
      options: [
        { label: '选项1', value: '1' },
        { label: '选项2', value: '2' },
      ],
    },
  },
  {
    label: '日期',
    prop: 'inputNumber',
    formItem: {
      componentName: 'ElInputNumber',
      placeholder: '请输入',
    },
  },
  {
    label: '日期',
    prop: 'input',
    formItem: {
      prop: 'input1',
      placeholder: '请输入',
    },
  },
  {
    label: '日期',
    prop: 'input',
    formItem: {
      prop: 'input1',
      placeholder: '请输入',
    },
  },
  {
    label: '日期',
    prop: 'input',
    formItem: {
      prop: 'input1',
      placeholder: '请输入',
    },
  },
  {
    label: '日期',
    prop: 'input',
    formItem: {
      prop: 'input1',
      placeholder: '请输入',
    },
  },
  {
    label: '日期',
    prop: 'input',
    formItem: {
      prop: 'input1',
      placeholder: '请输入',
    },
  },
  {
    label: '日期',
    prop: 'input',
    formItem: {
      prop: 'input1',
      placeholder: '请输入',
    },
  },
  {
    label: '日期',
    prop: 'input',
    formItem: {
      prop: 'input1',
      placeholder: '请输入',
    },
  },
]
</script>

<style lang="scss" scoped></style>
